<template>
  <div>
    <uv-collapsePanel
      v-for="(item, index) in list"
      :key="index"
      :class="item[showNum] == 1 ? 'ss-m-y-20' : ''"
      :title="item[showTitle]"
      :num="item[showNum]"
      :status="item[showStatus]"
      :finishedTaskNum="item[showFinishedNum]"
      :totalTaskNum="item[showTotalNum]"
      :inde="index + 1"
      :lock="item[showLock]"
      :subPlanId="item.maintenanceSubPlanId"
      :floorId="item.buildingFloorId"
      :deviceId="item.deviceId"
      :deviceRemainTotal="item[showDeviceTotal]"
      :search="searchId"
      :offline-mode="offlineMode"
      :times="item.type"
      @toggle="toggle($event, item, parent)"
      @fatherMethod="fatherMethod"
      @taskTip="taskTip"
    >
      <div v-if="item[showName]">
        <div class="names" @click="Jump(i, item)" v-for="(i, index) in item[showName]">
          <div class="ss-flex">
            <uv-icon
              v-if="i.passStatus == 1"
              name="checkmark-circle-fill"
              color="#4EA770"
              size="18"
            />
            <uv-icon
              v-if="i.passStatus == 2"
              name="close-circle-fill"
              color="#FF3B30"
              size="18"
            />
            <div class="ss-m-x-10">{{ i.taskItemName }}</div>
          </div>
          <div
            class="ss-font-23"
            :style="{ marginLeft: i.passStatus != 0 ? '50rpx' : '14rpx' }"
          >
            已完成{{ i.completedCount || 0 }} 应完成{{ i.total || 0 }}
          </div>
        </div>
      </div>
      <uv-collapsePane-list
        v-if="item[children] && item[children].length > 0"
        :list="item[children]"
        :parent="[...parent, item]"
        :children="children"
        :num="showNum"
        :showName="showName"
        :showTitle="showDeviceName"
        :status="showStatus"
        :finishedTaskNum="showFinishedNum"
        :totalTaskNum="showTotalNum"
        :searchId="searchId"
        :deviceRemainTotal="showDeviceTotal"
        :offline-mode="offlineMode"
        @fatherMethod="fatherMethod"
        @taskTip="taskTip"
      />
    </uv-collapsePanel>
  </div>
</template>

<script>
export default {
  name: "uv-collapsePane-list",
  props: {
    list: {
      type: Array,
      default() {
        return [];
      },
    },
    parent: {
      type: Array,
      default() {
        return [];
      },
    },
    showTitle: {
      type: String,
      default: "systemName",
    },
    showDeviceName: {
      type: String,
      default: "deviceName",
    },
    showName: {
      type: String,
      default: "tasksItemList",
    },
    showFinishedNum: {
      type: String,
      default: "completedCount",
    },
    showTotalNum: {
      type: String,
      default: "total",
    },
    showDeviceTotal: {
      type: String,
      default: "deviceRemainTotal",
    },
    children: {
      //需要识别的code标识
      type: String,
      default: "deviceTasksList",
    },
    showNum: {
      type: String,
      default: "level",
    },
    showStatus: {
      type: String,
      default: "passStatus",
    },
    showLock: {
      type: String,
      default: "lockStatus",
    },
    searchId: {
      type: [String, Number],
      default: "",
    },
    // 离线模式
    offlineMode: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {};
  },
  methods: {
    toggle(e, item, parent) {
      this.$emit("toggle", e, item, parent);
    },
    Jump(i, item) {
      if (this.offlineMode) {
        uni.setStorageSync("offline-task-detail", i);
      }
      console.log(i, item);
      let params = {
        id: i.deviceItemId,
        completedCount: i.completedCount,
        type: item.type,
        taskItemId: i.taskItemId,
        systemId: item.systemId,
        deviceId: item.deviceId,
        deviceName: item.deviceName,
        total: item.completedCount + item.deviceRemainTotal,
        allowTotal: item.total,
        floorDeviceId: item.id,
      };
      let urlParams = Object.keys(params)
        .map((key) => encodeURIComponent(key) + "=" + encodeURIComponent(params[key]))
        .join("&");
      uni.navigateTo({
        url: `/pages/Task/checkRecord?${urlParams}`,
      });
    },
    taskTip(e) {
      this.$emit("taskTip", e);
    },
    fatherMethod() {
      this.$emit("fatherMethod");
    },
  },
};
</script>

<style lang="scss" scoped>
@import "@/uni.scss";

.names {
  text-align: left;
  padding: 20rpx 20rpx;
  color: #666;
  font-size: 0.93rem;
  border: 1px solid #eaeaea;
}
</style>
